<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="注意：这篇文章依赖 Hugo v0.11 版本的功能。如果你的 Hugo 是早期版本，你需要在此之前 升级 你的版本。 第一步 安装 Hugo 到 Hugo Releases 下载适合你的操作系统的版本。 把 hugo （或者">
        <link rel="alternate" href="https://www.feiyangkeji.com/feed.xml" type="application/rss+xml" title="阳阳学编程">
        <link rel="icon" href="https://www.feiyangkeji.com/favicon.ico">
        <title>Hugo 快速开始指引 - 阳阳学编程</title>
        <link rel="stylesheet" href="https://www.feiyangkeji.com/css/highlight.js.min.css">
        <link rel="stylesheet" href="https://www.feiyangkeji.com/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://www.feiyangkeji.com/css/bootstrap-theme.css">
        <link rel="stylesheet" href="https://www.feiyangkeji.com/css/font-awesome/css/font-awesome.min.css" />
        
        <link rel="stylesheet" href="https://www.feiyangkeji.com/css/hugo-org.css">
    </head>

<body role="document">
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="https://www.feiyangkeji.com/">阳阳学编程</a>
            </div>
            <div id="navbar" class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    
                    <li ><a href="https://www.feiyangkeji.com/">主页</a></li>
                    <li ><a href="https://www.feiyangkeji.com/doc">固件下载</a></li>
                   
                    
                    <li ><a href="https://www.feiyangkeji.com/post/">文章列表</a></li>
                    
                    <li ><a href="https://www.feiyangkeji.com/theme/">开源项目</a></li>
                    
                    <li ><a href="https://www.feiyangkeji.com/showcase/">免费资源</a></li>
                    
                    <li ><a href="https://www.feiyangkeji.com/donate/">关于</a></li>
                    

                </ul>
            </div>
        </div>
    </nav>



<div class="container-fluid">

<div class="row">
    <div class="col-xs-12 col-sm-3">
        
<aside>
    <div class="well">
        
        <div class="pull-right">智能开关固件 v2.0.1(开发中...)</div>
        <ul class="nav nav-list">
            
            
            
            <li>
                <label class="tree-toggle nav-header">快速开始</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/overview/quickstart/">Quickstart</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">内容(Content)</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/content/archetypes/">Archetypes</a>
                    </li>
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/content/example_en/">Example</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">分类(Taxonomies)</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/taxonomies/displaying/">Displaying</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">常见问题</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/troubleshooting/overview/">Troubleshooting Overview</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">关于Hugo</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/meta/license/">License</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">community</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/community/mailing-list/">Mailing List</a>
                    </li>
                    
                    <li>
                        <a href="http://discuss.gohugo.io">讨论社区</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">extras</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/extras/shortcodes/">Shortcodes</a>
                    </li>
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/extras/toc_en/">Table of Contents</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">layout</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/templates/terms_en/">Taxonomy Terms</a>
                    </li>
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/templates/sitemap/">Sitemap</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">themes</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/themes/creation/">Creating a Theme</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
            <li>
                <label class="tree-toggle nav-header">tutorials</label>
                <ul class="nav nav-list">
                    
                    <li>
                        <a href="https://www.feiyangkeji.com/doc/tutorials/automated-deployments/">Automated deployments</a>
                    </li>
                    
                </ul>
            
            </li>
            
            
              
            <li>
                <a href="https://github.com/coderzh/feiyangkeji.com/edit/master/content/doc/overview/quickstart.md" target="blank">
                <i class='fa fa-edit'></i>修改此文章</a>
            </li>
            
            
        </ul>
    </div>
</aside>


    </div>
    <div class="col-xs-12 col-sm-9 doc-main">
        <main role="main">
            <article>
                <a id="title"></a>
                <h1 class="doc-entry-title">Hugo 快速开始指引</h1>
                <section>
                    <blockquote>
<p>注意：这篇文章依赖 Hugo v0.11 版本的功能。如果你的 Hugo 是早期版本，你需要在此之前 <a href="https://www.feiyangkeji.com/doc/overview/installing/">升级</a> 你的版本。</p>
</blockquote>
<!-- raw HTML omitted -->
<!-- raw HTML omitted -->
<h2 id="第一步-安装-hugo">第一步 安装 Hugo</h2>
<p>到 <a href="https://github.com/spf13/hugo/releases">Hugo Releases</a> 下载适合你的操作系统的版本。</p>
<p>把 <code>hugo</code> （或者是 Windows 的 <code>hugo.exe</code>） 放到你的 环境变量 <code>PATH</code> 所在的目录，因为下一步我们将会用到它。</p>
<p>更加完整的安装指南请参考： <a href="https://www.feiyangkeji.com/doc/overview/installing/">Installing Hugo</a>.</p>
<h2 id="第二步-让-hugo-为你创建一个站点">第二步 让 Hugo 为你创建一个站点</h2>
<p>Hugo 可以创建一个站点框架：</p>
<pre><code class="hljs nohighlight">$ hugo new site <i>path/to/site</i>
</code></pre>

<p>接下来的操作，我们将在刚创建的 site 目录里执行所有的命令。</p>
<pre><code class="hljs nohighlight">$ cd <i>path/to/site</i>
</code></pre>

<p>新创建的站点目录结构如下：</p>
<pre><code class="hljs nohighlight">  ▸ archetypes/
  ▸ doc/content/
  ▸ data/
  ▸ layouts/
  ▸ static/
    config.toml
</code></pre>

<p>当前的站点没有任何内容，也没有进行任何配置。</p>
<h2 id="第三步-创建文章内容">第三步 创建文章内容</h2>
<blockquote>
<p>如果你之前使用了其他的博客平台，比如 Jekyll 、 Ghost 或者 Wordpress ，并且希望转换你的内容，看看这个 <a href="https://www.feiyangkeji.com/doc/tools/#migration-tools">迁移工具</a> 列表。</p>
</blockquote>
<p>Hugo 可以创建一个文章内容页面：</p>
<pre><code>$ hugo new about.md
</code></pre>
<p>新创建的文件在目录 <code>content/</code> 里，内容如下：</p>
<pre><code>+++
date = &quot;2015-01-08T08:36:54-07:00&quot;
draft = true
title = &quot;about&quot;

+++

</code></pre><p>注意 date 字段是根据你创建文章的时间自动生成的。</p>
<p>在 <code>+++</code> 下面，用 Markdown 格式写一点内容。 比如：</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-markdown" data-lang="markdown"><span style="color:#75715e">## A headline
</span><span style="color:#75715e"></span>
Some Content
</code></pre></div><p>此外，我们再创建另外一篇文章并且同样写一些 Markdown 内容。</p>
<pre><code>$ hugo new post/first.md
</code></pre>
<p>新创建的文件会在 <code>content/post/first.md</code></p>
<p>我们仍然缺少任何的模板来显示我们的内容。</p>
<h2 id="第四步-安装皮肤">第四步 安装皮肤</h2>
<p>Hugo 对皮肤支持的很好，有大量的现成皮肤可选，并且一直在增加中。
要安装所有的 Hugo 皮肤，只需要 clone 完整的 <strong>hugoThemes</strong> 库到你的工作目录：</p>
<div class="highlight"><pre style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-bash" data-lang="bash">$ git clone --depth <span style="color:#ae81ff">1</span> --recursive https://github.com/spf13/hugoThemes.git themes
</code></pre></div><h2 id="第五步-运行-hugo">第五步 运行 Hugo</h2>
<p>Hugo 包含了内置的高性能 web server 。通过简单的运行 <code>hugo server</code> ， Hugo 将会找一个有效的端口运行服务器用于你的文章。</p>
<pre><code>$ hugo server --theme=hyde --buildDrafts
2 of 2 drafts rendered
0 future content
2 pages created
0 paginator pages created
0 tags created
0 categories created
in 15 ms
Watching for changes in /home/user/exampleHugoSite/{data,content,layouts,static,themes}
Serving pages from memory
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
</code></pre>
<p>我们指定了两个参数：</p>
<ul>
<li><code>--theme</code> 选择哪个皮肤;</li>
<li><code>--buildDrafts</code> 由于想显示我们的内容，包括设置了 draft 草稿状态的内容。</li>
</ul>
<p>想要了解更多其他的选项，执行：</p>
<pre><code>$ hugo help
</code></pre>
<p>想要了解 server 相关的选项：</p>
<pre><code>$ hugo help server
</code></pre>
<h2 id="第六步-编辑内容">第六步 编辑内容</h2>
<p>Hugo 不仅可以运行一个 server ，它还能够监控你的文件变化并自动重新编译你的站点。
Hugo 会和你的浏览器通信并且自动重新加载所有打开的页面。这同样也适用于移动端的浏览器。</p>
<p>按 <!-- raw HTML omitted -->Ctrl<!-- raw HTML omitted -->+<!-- raw HTML omitted -->C<!-- raw HTML omitted --> 可以停止 Hugo 进程。运行如下：</p>
<pre><code>$ hugo server --theme=hyde --buildDrafts
2 pages created
0 tags created
0 categories created
in 5 ms
Watching for changes in exampleHugoSite/content
Serving pages from exampleHugoSite/public
Web Server is available at http://localhost:1313
Press Ctrl+C to stop
</code></pre>
<p>打开你喜欢的 <a href="http://vim.spf13.com/">编辑器</a> ，编辑和保存你的文章内容，然后等待 Hugo 重新编译并自动重新加载。</p>
<p>将你的浏览器打开在另外一个显示器上，在你保存时只需要瞄一眼，这非常的高效。你甚至不需要切换到你的浏览器。
大多数情况下，当你看浏览器时，Hugo 已经足够快的刷新成了新的页面。</p>
<p>修改然后保存一个文件，看看命令行里发生了什么：</p>
<pre><code>Change detected, rebuilding site
2015-11-27 15:13 +0100
2 of 2 drafts rendered
0 future content
2 pages created
0 paginator pages created
0 tags created
0 categories created
in 11 ms
</code></pre>
<h2 id="第七步-玩得开心">第七步 玩得开心</h2>
<p>最好的学习方法是去使用它。</p>
<p>试试这些：</p>
<ul>
<li>添加一个 <a href="https://www.feiyangkeji.com/doc/content/organization/">new content file</a></li>
<li>创建一个 <a href="https://www.feiyangkeji.com/doc/content/sections/">new section</a></li>
<li>修改 <a href="https://www.feiyangkeji.com/doc/layout/templates/">a template</a></li>
<li>使用 <a href="https://www.feiyangkeji.com/doc/content/front-matter/">TOML front matter</a> 格式创建一篇文章</li>
<li>在 <a href="https://www.feiyangkeji.com/doc/content/front-matter/">front matter</a> 里定义一个自己的字段</li>
<li>显示 <a href="https://www.feiyangkeji.com/doc/layout/variables/">field in the template</a></li>
<li>创建一个 <a href="https://www.feiyangkeji.com/doc/content/types/">new content type</a></li>
</ul>

                </section>
            </article>
        </main>
        <br />
        
        <div class="row">
            <div class="col-xs-6 col-sm-6 text-center">
                
                <a href="https://www.feiyangkeji.com/doc/overview/introduction">&lt; 上一篇</a>
                
            </div>
            <div class="col-xs-6 col-sm-6 text-center">
                
                <a href="https://www.feiyangkeji.com/doc/overview/installing">下一篇 &gt;</a>
                
            </div>
        </div>
        
    </div> 
</div>



<hr />

<div class="row">
    <div class="col-sm-12">
        
	    <div class="text-center">
        
		    <p class="doc-footer-em"><a href="#">回到顶部↑</a></p>
	    </div>
	</div>
</div>

</div> 

<footer class="doc-footer">
	
    <p>Copyright © <a href="http://www.feiyangkeji.com/"> 北京飞阳信远科技有限公司(京ICP备2021020257号-1 )</a> 2021. Generated by <a href="http://gohugo.io/">Hugo</a></p>
</footer>

<script>
	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
	ga('create', 'UA-10147768-3', 'auto');
	ga('send', 'pageview');
</script>

<script src="https://www.feiyangkeji.com/js/jquery-1.11.2.min.js"></script>
<script src="https://www.feiyangkeji.com/js/bootstrap.min.js"></script>

<script src="https://www.feiyangkeji.com/js/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<script src="https://www.feiyangkeji.com/js/ie10-viewport-bug-workaround.js"></script>

</body>
</html>

